<template>
    <div class="shouye">
        
              <div ref="chartContainer" style="width: 600px; height: 400px;"></div>
    </div>
</template>

<script>
import * as echarts from 'echarts'
export default {
    name: "ShouYe",

    data(){
        return{}
    },
    mounted() {
        // 基于准备好的dom，初始化echarts实例
        const myChart = echarts.init(this.$refs.chartContainer);

        // 指定图表的配置项和数据
        const option = {
          title: {
            text: '班级人数分布图',
            left: 'left'
          },
          tooltip: {
            trigger: 'item'
          },
          legend: {
            // orient: 'vertical',
            left: 'center'
          },
          series: [
            {
              name: '信息', 
              type: 'pie',
              radius: '50%',
              data: [
                { value: 1, name: ' 一班' },
                { value: 2, name: '二班' },
               
              ],
            //   emphasis: {
            //     itemStyle: {
            //       shadowBlur: 10,
            //       shadowOffsetX: 0,
            //       shadowColor: 'rgba(0, 0, 0, 0.5)'
            //     }
            //   }
            }
          ]
        };
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
      }
    };
</script>

<style scoped>

</style>